<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        // 定义一个人的类
        class Person {
            // 调用构造器函数，给Person实例添加属性
            constructor(name, age) {
                this.name = name
                this.age = age
            }
            // this指向Person类的实例对象
            speak () {
                console.log(`我叫${this.name},今年${this.age}了`)
            }
        }

        // let p1 = new Person('张三', 18)
        // let p2 = new Person('李四', 20)
        // console.log(p1)
        // console.log(p2)
        // // 实例对象本身没有speak方法，按照原型链访问规则（访问的属性和方法本身不存在时，会去父类身上找）
        // console.log(p2.__proto__.speak === p2.speak) // true
        // p1.speak()
        // p2.speak()


        // 定义一个学生类，去继承人类
        class Student extends Person {
            constructor(name, age, grade) {
                // super调用父类构造器
                super(name, age)
                this.grade = grade
            }
        }
        // 实例化Student类，会自动执行父类上的构造器，既constructor
        // let s1 = new Student() //（没有传入name和age，所以实例化对象身上name和age为undefined）
        // let s1 = new Student('小米', 22, '高一')
        // console.log(s1)

        // 定义一个小学生类，去继承学生类
        class PrimaryStudent extends Student {
            constructor(name, age, grade, height) {
                super(name, age, grade)
                this.height = height
            }
        }

        let pp1 = new PrimaryStudent('小米', 22, '高三', 180)
        console.log(pp1)

        // class Person {
        //     constructor(name, age) {
        //         this.name = name
        //         this.age = age
        //     }
        //     speak () {
        //         console.log(`我叫${this.name},今年${this.age}了`)
        //     }
        // }

        // const p1 = new Person('米', 22)
        // p1.speak()

        // const a = p1.speak.bind({})
        // a()
    </script>
</body>

</html>